@import './modules/footer.scss';
@import './modules/reset.scss';

/* 订单页面header部分 开始 G 2020 0823 */
// .header{
//     height: 42px;
//     box-shadow: 1px 1px 1px rgba(0,0,0,.1);
//     &-content{
//         width: 1020px;
//         height: 42px;
//         margin: 0 auto;
//         display: flex;
//         justify-content: space-between;
//         align-items: center;
//         a img{
//             width: 130px;
//         }
//         &-right{
//             width: 200px;
//             ul li{
//                 float: left;
//                 font-size: 16px;
//                 color: #222;
//                 &:nth-of-type(1){
//                     width: 99px;
//                     border-right: 1px solid #ccc;
//                     color: #f25d8e;
//                     i{
//                         font-size: 16px;
//                         margin-right: 5px;
//                     }
//                 }
//                 &:nth-of-type(2){
//                     display: none;
//                     box-sizing: border-box;
//                     width: 100px;
//                     padding: 0 10px;
//                     display: flex;
//                     justify-content: space-between;
//                     a{
//                         color: #222;
//                     }
//                 }
//                 &:nth-of-type(3){
//                     box-sizing: border-box;
//                     width: 100px;
//                     padding: 0 10px;
//                 }
//                 &.ac{
//                     display: none;
//                 }
//             }

//         }
//     }
// }
/* 订单页面header部分 结束 G 2020 0823 */

/* 头部样式开始 G 2020/8/20 */
$color:#fb7199;

header{
    height: 60px;
    background-color: #ffffff;
    nav{
        width: 1160px;
        height: 60px;
        margin: 0 auto;
        display: flex;
        justify-content: space-between;
        align-items: center;
        .logo{
            width: 130px;
            height: 27px;
        }
        .header-nav-mainstation{
            margin-left: 40px;
            i{
                font-size: 20px;
                color: $color;
            }
            span{
                font-size: 14px;
                color: #636c7b;
            }
        }
        .header-nav-search{
            width: 670px;
            height: 40px;
            position: relative;
            input{
                width: 380px;
                height: 40px;
                float: right;
                background-color: #f1f3f5;
                border-radius: 20px;
                color: #aaaaaa;
                font-size: 12px;
                padding-left: 20px;
            }
            i{
                font-size: 20px;
                color: #969ba3;
                position: absolute;
                top: 12px;
                right: 12px;
                cursor: pointer;
            }
        }
        .ac {
            display: none;
        }
        .header-nav-lore{
            font-size: 14px;
            width: 90px;
            margin-left: 30px;
            line-height: 14px;
            span{
                font-size: 14px;
                color: #636c7b;
            }
            a{
                color: #636c7b;
                &:hover{
                    color: $color;
                }
            }
        }
        .header-nav-welcome{
            font-size: 14px;
            min-width: 100px;
            margin-left: 30px;
            line-height: 14px;
            color: #636c7b;
        }
        .header-nav-order{
            width: 92px;
            margin-left: 25px;
            color: #636c7b;
            cursor: pointer;
            &:hover a{
                color: #fb7199;
            }
            a{
                color: #636c7b;
                i{
                    font-size: 16px;
                }
                span{
                    font-size: 14px;
                }
            }
        }
    }
}
/* 头部结束 G 2020 0820 */

/* 订单页面mian部分 开始 G 2020 0823 */
main{
    min-height: 470px;
    .ac{
        display: none;
    }
    .main-order{
        margin: 0 auto;
        width: 1020px;
        min-height: 470px;
        overflow: hidden;
        // padding-bottom: 20px;
        &-item{
            height: 170px;
            border-radius: 5px;
            margin-top: 20px;
            border: 1px solid #e5e9ef;
            &-title{
                background-color: #f4f5f7;
                color: #99a2aa;
                ul{
                    height: 40px;
                }
            }
            &-content{
                background-color: #fff;
                color: #222222;
                ul{
                    height: 130px;
                    li.content-li{
                        .item-content-img{
                            float: left;
                            width: 75px;
                            height: 100px;
                            margin-left: 15px;
                            img{
                                border-radius: 5px;
                                width: 100%;
                            }
                        }
                        .item-content-msg{
                            float: left;
                            margin-left: 15px;
                            width: 220px;
                            height: 100px;
                            box-sizing: border-box;
                            padding: 5px 0;
                            display: flex;
                            flex-direction: column;
                            justify-content: space-between;
                            text-align: left;
                            &-title{
                                font-size: 16px;
                                color: #222222;
                            }
                            &-time, &-price, &-session{
                                color: #99a2aa;
                                line-height: 12px;
                                font-size: 12px;
                                overflow: hidden;
                                text-overflow: ellipsis;
                                white-space: nowrap;
                            }
                        }
                        
                    }
                    li.chosenum{
                        display: flex;
                        justify-content: center;
                        i{
                            width: 26px;
                            height: 26px;
                            cursor: pointer;
                            font-size: 23px;
                            color: #99a2aa;
                            border: 1px solid #99a2aa;
                            background-color: #efefef;
                        }
                        span{
                            width: 70px;
                            line-height: 26px;
                            color: #99a2aa;
                            border-top: 1px solid #99a2aa;
                            border-bottom: 1px solid #99a2aa;
                        }
                    }
                    li.content-li-btn{
                        display: flex;
                        flex-direction: column;
                        align-items: center;
                        div button{
                            width: 100px;
                            height: 30px;
                            border-radius: 4px;
                            cursor: pointer;
                            color: #99a2aa;
                        }
                    }
                }

            }
            ul{
                display: flex;
                align-items: center;
                justify-content: space-between;
                text-align: center;
                li.flex-wid{
                    flex: 1;
                }
                li.eidit-li{
                    width: 40px;
                }
                li:not([flex-wid]), li:not([eidit-li]){
                    width: 120px;
                }
            }
        }
    }
    .elac-order{
        width: 1020px;
        height: 80px;
        margin: 50px auto 0;
        border-top: 1px solid #efefef;
        display: flex;
        justify-content: space-between;
        align-items: center;
        &-right{
            display: flex;
            align-items: center;
            &-total{
                margin-right: 20px;
                
            }
            .elacbtn{
                width: 100px;
                height: 40px;
                background-color: #f25d8e;
                color: #fff;
                border-radius: 5px;
                cursor: pointer;
            }
        }
        
    }
    .noorder{
        width: 980px;
        margin: 0 auto;
        &-img{
            width: 210px;
            height: 210px;
            margin: 60px auto 0;
            img{
                width: 100%;
            }
        }
        &-msg{
            margin: 25px 0 0;
            text-align: center;
            font-size: 16px;
            color: #99a2aa;
        }
        &-src{
            text-align: center;
            margin-top: 30px;
            margin-bottom: 200px;
            a button{
                cursor: pointer;
                font-size: 18px;
                background-color: #fff;
                border-radius: 4px;
                border: 1px solid #cbd1d7;
                color: #6c767a;
                text-align: center;
                width: 160px;
                height: 52px;
                line-height: 52px;
            }
        }
    }
}
/* 订单页面mian部分 结束 G 2020 0823 */